<script>
import axios from "axios";
// import Cookies from "js-cookie";

export default {
  name: "indexPage",
  created() {
    console.log(this.$route.query.row);
  },
  data() {
    return {
      username: null,
      password: null,
      token: null,
    }
  },

  methods: {
    // this.$store.state.userInfolist = {
    //   // token: res.data.token,
    //   username: this.loginParams.username,
    //   password: this.loginParams.password
    // }
    // // this.loginParams.token = res.data.token;
    // this.$router.push({path: '/index'})
    // window.localStorage.setItem('userInfolist', JSON.stringify(this.$store.state.userInfolist))
    // JSON.parse(localStorage.getItem('userInfo')).password,
    async goCrm() {
      this.username = JSON.parse(localStorage.getItem('VUEX:STATE')).userInfolist.username
      this.password = JSON.parse(localStorage.getItem('VUEX:STATE')).userInfolist.password
      // 点击获取登录token
      await axios.post('http://8.130.100.110:8080/ruoyi-admin/login', {
        username: this.username,
        password: this.password,
      }).then(res => {
        if (res.data.code === 200) {
          console.log(res)
          this.token = res.data.token;
          /* 设置 Cookie 值 */
          document.cookie = 'Admin-Token=' + res.data.token;
          // document.cookie = res.data.token;
          this.$store.state.userInfolist = {
            // token: res.data.token,
            username: this.username,
            password: this.password,
            token: res.data.token
          }
          const targetWindow = window.open('http://8.130.100.110:8080/dist', '_blank');
          targetWindow.postMessage('111111', 'http://8.130.100.110:8080/dist/login');
          // window.setTimeout(() => {
          window.addEventListener('message', () => {
          })
          // window.open('http://192.168.31.44:85/login', '_blank')
          // }, 1000)
        } else {
          this.$message.error(res.data.msg);
        }
      })
      // const targetWindow = window.open('http://8.130.82.196:8081/dist/');
      // setTimeout(() => {
      //   targetWindow.postMessage(this.$store.state.userInfolist, 'http://8.130.82.196:8081/dist/index')
      // }, 1000)
    },
    async goChejian() {
      this.username = JSON.parse(localStorage.getItem('VUEX:STATE')).userInfolist.username
      this.password = JSON.parse(localStorage.getItem('VUEX:STATE')).userInfolist.password
      // 点击获取登录token
      await axios.post('http://8.130.100.110:8082/ruoyi-workshop/login', {
        username: this.username,
        password: this.password,
      }).then(res => {
        if (res.data.code === 200) {
          console.log(res)
          this.token = res.data.token;
          /* 设置 Cookie 值 */
          document.cookie = 'Admin-Token=' + res.data.token;
          // document.cookie = res.data.token;
          this.$store.state.userInfolist = {
            // token: res.data.token,
            username: this.username,
            password: this.password,
            token: res.data.token
          }
          const targetWindow = window.open('http://8.130.100.110:8082/workshop', '_blank');
          targetWindow.postMessage('111111', 'http://8.130.100.110:8082/workshop/login');
          // window.setTimeout(() => {
          window.addEventListener('message', () => {
          })
          // window.open('http://192.168.31.44:85/login', '_blank')
          // }, 1000)
        } else {
          this.$message.error(res.data.msg);
        }
      })
      // const targetWindow = window.open('http://8.130.82.196:8081/dist/');
      // setTimeout(() => {
      //   targetWindow.postMessage(this.$store.state.userInfolist, 'http://8.130.82.196:8081/dist/index')
      // }, 1000)
    },
    async goCangku() {
      // 8080
      this.username = JSON.parse(localStorage.getItem('VUEX:STATE')).userInfolist.username
      this.password = JSON.parse(localStorage.getItem('VUEX:STATE')).userInfolist.password
      // 点击获取登录token
      await axios.post('http://8.130.100.110:8081/ruoyi-warehouse/login', {
        username: this.username,
        password: this.password,
      }).then(res => {
        if (res.data.code === 200) {
          console.log(res)
          this.token = res.data.token;
          /* 设置 Cookie 值 */
          document.cookie = 'Admin-Token=' + res.data.token;
          // document.cookie = res.data.token;
          this.$store.state.userInfolist = {
            // token: res.data.token,
            username: this.username,
            password: this.password,
            token: res.data.token
          }
          const targetWindow = window.open('http://8.130.100.110:8081/warehouse', '_blank');
          targetWindow.postMessage('111111', 'http://8.130.100.110:8081/warehouse/login');
          // window.setTimeout(() => {
          window.addEventListener('message', () => {
          })
          // window.open('http://192.168.31.44:85/login', '_blank')
          // }, 1000)
        } else {
          this.$message.error(res.data.msg);
        }
      })
      // const targetWindow = window.open('http://8.130.82.196:8081/dist/');
      // setTimeout(() => {
      //   targetWindow.postMessage(this.$store.state.userInfolist, 'http://8.130.82.196:8081/dist/index')
      // }, 1000)
    },
    goXiangmu() {
      window.open('http://124.239.217.148:19090/dragon', '_blank')
    }
  }
}
</script>

<template>
  <div class="main">
    <div class="titleBox">
      <div class="title" style="font-size: 70px">企业综合管理平台</div>
    </div>
    <el-row class="flexBox">
      <el-col :span="8">
        <div class="grid-content bg-purple" id="crmBox" @click="goCrm">
          <div>
            <span class="font">CRM管理</span>
          </div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="grid-content bg-purple-light" id="chajianBox" @click="goChejian">
          <div>
            <span class="font">车间管理</span>
          </div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="grid-content bg-purple" id="cangkuBox" @click="goCangku">
          <div>
            <span class="font">仓库管理</span>
          </div>
        </div>
      </el-col>
      <!--      <el-col :span="6">-->
      <!--        <div class="grid-content bg-purple" id="xiangmuBox" @click="goXiangmu">-->
      <!--          <div>-->
      <!--            <span class="font">项目管理</span>-->
      <!--          </div>-->
      <!--        </div>-->
      <!--      </el-col>-->
    </el-row>
  </div>
</template>

<style scoped lang="less">
* {
  margin: 0 auto;
}

.titleBox {
  div {
    padding-top: 10vh;
    margin-bottom: 15vh;
  }
}

//.flexBox {
//  display: flex;
//  flex-wrap: wrap;
//
//  .el-col {
//    width: 30%;
//  }
//}
.font {
  font-weight: bolder;
  font-size: 45px;
}

.main {
  //padding-top: 100px;
  //padding: 100px;
  height: 100%;
  background-image: url('@/image/bb.png');
  background-repeat: no-repeat;
  //background-size: cover;

  background-size: 100% 100%;
}

#crmBox {
  cursor: pointer;
  background-color: rgb(116, 140, 241);
}

//161 255 9
#chajianBox {
  cursor: pointer;
  background-color: rgb(108, 234, 182);
}

//252 105 0
#cangkuBox {
  cursor: pointer;
  background-color: rgb(13, 227, 239);
}

#xiangmuBox {
  cursor: pointer;
  background-color: rgb(200, 184, 16);
}

.el-row {
  margin-bottom: 20px;

  &:last-child {
    margin-bottom: 0;
  }
}

.el-col {
  border-radius: 4px;
}

.bg-purple-dark {
  background: #99a9bf;
}

.bg-purple {
  background: #d3dce6;
}

.bg-purple-light {
  background: #e5e9f2;
}

.grid-content {
  line-height: 30vh;
  height: 30vh;
  margin: 20px;
  //border-radius: 4px;
  min-height: 36px;

  div {
    font-size: 30px;
    font-weight: 700;
    font-family: "PingFang SC", serif;
    color: black;
  }
}

.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}

@media screen and (max-width: 431px) {
  .title {
    margin-bottom: 50px !important;
    font-size: 30px !important;
    //color: blue;
  }

  .grid-content {
    div {
      font-size: 16px !important;
    }
  }
}

</style>